<%--
  Created by IntelliJ IDEA.
  User: 10254
  Date: 2021/3/20
  Time: 20:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page isELIgnored="false" %>
<html>
<head>
    <title>商品详情</title>
</head>
<body>

<h1>商品详情</h1>
<img src="/images/${requestScope.goods.goods_image}"/>
<h2>${requestScope.goods.goods_name}</h2>
<h3>${requestScope.goods.goods_price}</h3>
<h4>${requestScope.goods.goods_desc}</h4>

<button id="btn1" value="-">-</button>
<input id="num" type="text" value="1">
<button id="btn2" value="+">+</button>
<button id="btn3" value="加入购物车">加入购物车</button>
<form action="/buy">
    <input type="hidden" name="path" value="1">
    <input type="submit" value="购买">
</form>


</body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script>
    //入口函数
    $(function () {

        //当鼠标在输入框失去焦点时
        $("#num").on("blur", function () {
            var arr = $("#num").val().array;

            //输入非数字时
            if (isNaN(parseInt($("#num").val()))) {
                alert("输入非法字符 请重新输入")
                $("#num").val(1)
            }
            //当数量过大时
            if (parseInt($("#num").val()) > 99) {
                alert("数量超过最大值")
                $("#num").val(99)
            }
            //当数量过小时
            if (parseInt($("#num").val()) < 1) {
                alert("数量小于最小值请重新输入")
                $("#num").val(1)
            }
        });


        // 点击减号按钮 如果数量大于1 减一
        $("#btn1").on("click", function () {
            if (parseInt($("#num").val()) > 1) {
                $("#num").val(parseInt($("#num").val()) - 1);
            }
        })
        // 点击加号按钮 如果数量小于99 加1
        $("#btn2").on("click", function () {
            if (parseInt($("#num").val()) < 99) {
                $("#num").val(parseInt($("#num").val()) + 1);
            }
        })

        //点击加入购物车时
        $("#btn3").on("click", function () {
            var num = $("#num").val();
            location.href = "${pageContext.request.contextPath}/pushcar?goodId=${requestScope.goods.goods_id}&num=" + num
        })
    })
</script>

</html>
